<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('出库端回流监控')"/>
    <th:block th:include="include :: layout-latest-css"/>
    <th:block th:include="include :: ztree-css"/>
    <!--    <link rel="stylesheet" type="text/css" href="/css/bootstrap-switch.min.css">-->
</head>
<body class="gray-bg">
<div class="ui-layout-center">
    <div class="container-div">
        <div class="row col-sm-12" style="height: 100%;width: 49%">
            <div id="div1" style="height: 49%;width: 100%" >
                <table id="bootstrap-table1" class="col-sm-5 select-table"></table>
            </div>
            <div id="div" style="height: 49%;width: 100%" >
                <table id="bootstrap-table" class="col-sm-5 select-table"></table>
            </div>
        </div>
        <div class="row col-sm-12" style="height: 100%;width: 49%">
            <div id="div2" style="height: 49%;width: 100%" >
                <table id="bootstrap-table2" class="col-sm-5 select-table"></table>
            </div>
            <div id="div3" style="height: 49%;width: 100%" >
                <table id="bootstrap-table3" class="col-sm-5 select-table"></table>
            </div>
        </div>
    </div>
</div>

<th:block th:include="include :: footer"/>
<th:block th:include="include :: layout-latest-js"/>
<th:block th:include="include :: ztree-js"/>

<script th:inline="javascript">

    var prefix = ctx + "deviceInfo";
    var errDatas = [[${@dict.getType('rgv_err_msg')}]];

    //页面加载完成后执行
    $(function () {
        var panehHidden = false;
        if ($(this).width() < 769) {
            panehHidden = true;
        }
        $('body').layout({initClosed: panehHidden, west__size: 85});
        // 回到顶部绑定
        if ($.fn.toTop !== undefined) {
            var opt = {
                win: $('.ui-layout-center'),
                doc: $('.ui-layout-center')
            };
            $('#scroll-up').toTop(opt);
        }
        queryUserList();
        queryUserList1();
        queryUserList2();
        queryUserList3();
        reloadTable();
    });

    function reloadTable() {
        $('#bootstrap-table').bootstrapTable('refresh');
        $('#bootstrap-table1').bootstrapTable('refresh');
        $('#bootstrap-table2').bootstrapTable('refresh');
        $('#bootstrap-table3').bootstrapTable('refresh');
        setTimeout(reloadTable, 3 * 1000);
    }

    function queryUserList() {

        var options = {
            url: prefix + "/listxdhl",
            height: $("#div").height() / 1,
            sortName: "id", //排序字段
            sortOrder: "asc",   //排序规则
            modalName: "输送机",
            columns: [
                // 		{
                // 	checkbox: true
                // },
                {
                    field: 'devName',
                    title: '设备名字 '
                },
                {
                    field: 'taskNo',
                    title: '任务号',
                    sortable: true
                },
                {
                    field: 'dw',
                    title: '到位',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未到位";
                        } else if (value == 1) {
                            return "到位";
                        }
                    }
                },
                {
                    field: 'kx',
                    title: '空闲',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未空闲";
                        } else if (value == 1) {
                            return "空闲";
                        }
                    }
                }
            ]
        };
        $('#bootstrap-table').bootstrapTable(options)
    }

    function queryUserList1() {

        var options1 = {
            url: prefix + "/listxdkhl",
            height: $("#div1").height() / 1,
            modalName: "输送机",
            columns: [
                {
                    field: 'devName',
                    title: '设备名字 '
                },
                {
                    field: 'taskNo',
                    title: '任务号',
                    sortable: true
                },
                {
                    field: 'dw',
                    title: '到位',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未到位";
                        } else if (value == 1) {
                            return "到位";
                        }
                    }
                },
                {
                    field: 'kx',
                    title: '空闲',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未空闲";
                        } else if (value == 1) {
                            return "空闲";
                        }
                    }
                }
            ]
        };
        $('#bootstrap-table1').bootstrapTable(options1)
    }

    function queryUserList2() {

        var options2 = {
            url: prefix + "/listrgvhl",
            height: $("#div2").height() / 1,
            modalName: "线体输送机",
            columns: [
                {
                    field: 'devName',
                    title: '设备名字 '
                },
                {
                    field: 'taskNo',
                    title: '任务号',
                    sortable: true
                },
                {
                    field: 'dw',
                    title: '到位',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未到位";
                        } else if (value == 1) {
                            return "到位";
                        }
                    }
                }
            ]
        };
        $('#bootstrap-table2').bootstrapTable(options2)
    }

    function queryUserList3() {

        var options3 = {
            url: prefix + "/listsmk",
            height: $("#div3").height() / 1,
            modalName: "线体输送机",
            columns: [
                {
                    field: 'devName',
                    title: '设备名字 '
                },
                {
                    field: 'taskNo',
                    title: '任务号',
                    sortable: true
                },
                {
                    field: 'heights',
                    title: '高度',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "未空闲";
                        } else if (value == 1) {
                            return "空闲";
                        }
                    }
                },
                {
                    field: 'yxqf',
                    title: '请求',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 0) {
                            return "无请求";
                        } else if (value == 1) {
                            return "请求";
                        }
                    }
                },
                {
                    field: 'qfwc',
                    title: '货物类型',
                    sortable: true,
                    formatter: function (value, row, index) {
                        if (value == 1) {
                            return "托盘";
                        } else if (value == 2) {
                            return "货物";
                        }
                    }
                },
                {
                    field: 'trayCode',
                    title: '托盘条码'
                }
            ]
        };
        $('#bootstrap-table3').bootstrapTable(options3)
    }
</script>
</body>
</html>
